
<div style="POSITION: relative" id="content">
  <h3>easyUI 创建Dialog对话框</h3>
  <div id="article_content" class="article_content">
    <p>dialog是一个特殊的window,可以包含工具栏在顶部和按钮在下面,但是默认的dialog不能改变大小,但是用户可以设置<span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left">resizable 属性为true使其可以改变大小.</span></p>
    <p><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"><img src="documentation/images/1344676111_9551.png" alt=""><br>
      </span></p>
    <p><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"><a href="http://www.jeasyui.com/tutorial/win/dlg1_demo.html" target="_blank" style="font-size:14px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left">查看
      Demo</a><br>
      </span></p>
    <p></p>
    <h4 style="font-size:16px; color:rgb(204,0,0); margin:10px 0px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left"> 创建 Dialog</h4>
    dialog非常简单,可以从<span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left">DIV 创建,就像这样:</span>
    <p></p>
    <p><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"></span>
    <pre name="code" class="html">&lt;div id=&quot;dd&quot; class=&quot;easyui-dialog&quot; style=&quot;padding:5px;width:400px;height:200px;&quot;  
        title=&quot;My Dialog&quot; iconCls=&quot;icon-ok&quot;  
        toolbar=&quot;#dlg-toolbar&quot; buttons=&quot;#dlg-buttons&quot;&gt;  
    Dialog Content.  
&lt;/div&gt;  </pre>
    </p>
    <h4 style="font-size:16px; color:rgb(204,0,0); margin:10px 0px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left"> 准备工具栏和按钮</h4>
    <pre name="code" class="html">&lt;div id=&quot;dlg-toolbar&quot;&gt;  
    &lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; iconCls=&quot;icon-add&quot; plain=&quot;true&quot; onclick=&quot;javascript:alert('Add')&quot;&gt;Add&lt;/a&gt;  
    &lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; iconCls=&quot;icon-save&quot; plain=&quot;true&quot; onclick=&quot;javascript:alert('Save')&quot;&gt;Save&lt;/a&gt;  
&lt;/div&gt;  
&lt;div id=&quot;dlg-buttons&quot;&gt;  
    &lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; iconCls=&quot;icon-ok&quot; onclick=&quot;javascript:alert('Ok')&quot;&gt;Ok&lt;/a&gt;  
    &lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; iconCls=&quot;icon-cancel&quot; onclick=&quot;javascript:$('#dd').dialog('close')&quot;&gt;Cancel&lt;/a&gt;  
&lt;/div&gt;  </pre>
    以上代码我们创建了一个<span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left">dialog 和工具栏以及按钮,这是标准配置<span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left">dialog,
    toolbar, content 和buttons.</span></span><br>
    <br>
    <h4 style="font-size:16px; color:rgb(204,0,0); margin:10px 0px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left"> 下载 &nbsp;EasyUI 示例代码:</h4>
    <div style="font-size:14px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left; padding-left:50px"> <a href="http://www.jeasyui.com/tutorial/win/download/easyui-dialog1-demo.zip" target="_blank" class="download-link" style="color:rgb(0,0,255)">easyui-dialog-demo.zip</a></div>
    <br>
  </div>
</div>
<SCRIPT type=text/javascript>
	dp.SyntaxHighlighter.ClipboardSwf = 'documentation/js/clipboard.swf'/*tpa=http://jeasyui.com/SyntaxHighlighter/Scripts/clipboard.swf*/;
	dp.SyntaxHighlighter.HighlightAll('code');
</SCRIPT>